<template>
  <div class="cate">
    <van-grid column-num="4">
    <van-grid-item  v-for="item in cates" icon-prefix="icon"  :icon="item.icon" :id="item.icon" :text="item.name" :key="item.id" @click="$router.push({
      path:'/Search',
      query:{ goodName:item.name}
    })" />
   
    </van-grid>
    </div>
  
</template>

<script>
  export default {
      props:['cates']
  }
</script>

<style lang="scss" scoped>
.cate{
 
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  .van-hairline--top{
    width: 100%;
  }
  .cate-list{
    
    text-align: center;
  }

}
</style>